<template lang="">
    <div>
            <div id="app" v-cloak>
                    <div class="header_con">
                        <div class="header">
                            <div class="welcome fl">欢迎来到美多商城!</div>
                            <div class="fr">
                                <div class="login_info fl">
                                    欢迎您：<em>张 山</em>
                                </div>
                                <div class="login_btn fl">
                                    <a href="login.html">登录</a>
                                    <span>|</span>
                                    <a href="register.html">注册</a>
                                </div>
                                <div class="user_link fl">
                                    <span>|</span>
                                    <a href="user_center_info.html">用户中心</a>
                                    <span>|</span>
                                    <a href="cart.html">我的购物车</a>
                                    <span>|</span>
                                    <a href="user_center_order.html">我的订单</a>
                                </div>
                            </div>
                        </div>		
                    </div>
                
                    <div class="search_bar clearfix">
                        <a href="index.html" class="logo fl"><img src="images/logo.png"></a>
                        <div class="search_wrap fl">
                            <form method="get" action="/search/" class="search_con">
                                <input type="text" class="input_text fl" name="q" placeholder="搜索商品">
                                <input type="submit" class="input_btn fr" name="" value="搜索">
                            </form>
                            <ul class="search_suggest fl">
                                <li><a href="#">索尼微单</a></li>
                                <li><a href="#">优惠15元</a></li>
                                <li><a href="#">美妆个护</a></li>
                                <li><a href="#">买2免1</a></li>
                            </ul>
                        </div>		
                    </div>
                    
                    <h3 class="common_title">确认收货地址</h3>
                
                    <div class="common_list_con clearfix" id="get_site">
                        <dl>
                            <dt>寄送到：</dt>
                           
                            <dd v-for='i in addresslist'>
                              
                                <input type="radio"  :value="i.id" v-model="address_id" >
                                北京市 {{i.city}} 东北旺西路8号中关村软件园 （{{i.receive}} 收） 182****7528</dd>
                                
                               
                           
                        </dl>
                        <a href="user_center_site.html" class="edit_site">编辑收货地址</a>
                    </div>
                    
                    <h3 class="common_title">支付方式</h3>
                    <div class="common_list_con clearfix">
                        <div class="pay_style_con clearfix">
                            <input type="radio" name="pay_method" value="1" v-model='pay_type'>
                            <label class="cash" >货到付款</label>
                            <input type="radio" name="pay_method" value="2" v-model='pay_type'>
                            <label class="zhifubao"></label>
                        </div>
                    </div>
                
                    <h3 class="common_title">商品列表</h3>
                    
                    <div class="common_list_con clearfix">
                            <ul class="goods_list_th clearfix">
                                    <li class="col01">商品名称</li>
                                    <li class="col03">商品价格</li>
                                    <li class="col04">数量</li>
                                    <li class="col05">小计</li>		
                                </ul>
                                <ul class="goods_list_td clearfix" v-for='(i,index) in carts'>
                                    <li class="col01">{{index+1}}</li>			
                                    <li class="col02"><img src="images/goods/goods001.jpg"></li>
                                    <li class="col03">{{i.name}}</li>
                                    <li class="col05">25.80元</li>
                                    <li class="col06">1</li>
                                    <li class="col07">25.80元</li>	
                                </ul>
                        
                    </div>
                
                    <h3 class="common_title">总金额结算</h3>
                
                    <div class="common_list_con clearfix">
                        <div class="settle_con">
                            <div class="total_goods_count">共<em>{{tcount}}</em>件商品，总金额<b>{{tmoney}}元</b></div>
                           
                            <div class="total_pay">实付款：<b>{{tmoney}}元</b></div>
                        </div>
                    </div>
                
                    <div class="order_submit clearfix">
                        <a @click='placeOrder' id="order_btn">提交订单</a>
                        
                    </div>	
                
                    <div class="footer">
                        <div class="foot_link">
                            <a href="#">关于我们</a>
                            <span>|</span>
                            <a href="#">联系我们</a>
                            <span>|</span>
                            <a href="#">招聘人才</a>
                            <span>|</span>
                            <a href="#">友情链接</a>		
                        </div>
                        <p>CopyRight © 2016 北京美多商业股份有限公司 All Rights Reserved</p>
                        <p>电话：010-****888    京ICP备*******8号</p>
                    </div>
                    </div>
    </div>
</template>
<script>
export default {
    data(){
        return{
            addresslist:[],
            pay_type:1,
            carts:[],
            tcount:0,
            tmoney:0,
            userid:localStorage.getItem('id'),
            address_id:'',
        }
    },
    methods: {
        getPlaceOrder(){
            //调用地址接口拿到地址
            this.axios.get('users/addressManage/?user_id='+this.userid).then(res=>{
                this.addresslist = res.data.addresslist
                //默认选中
                this.addresslist.forEach((address)=>{
                    if (address.is_default==1){
                        this.address_id = address.id
                    }
                })
                
            })
            //调用购物车接口拿到已经选择的商品
            this.axios.get('users/cartManage/?userid='+this.userid).then(res=>{
                this.carts = res.data.slist
                this.tcount=res.data.selectedtcount
                this.tmoney = res.data.selectedtmoney
            })

        },
        placeOrder(){
            //获取支付方式
            //获取到地址
            this.axios.post('users/orderManage/',{'user_id':this.userid,'pay_type':this.pay_type,'address_id':this.address_id}).then(res=>{
                //订单号,金额
                if(res.data.code == 200){
                    var order_no = res.data.order_no
                    var tmoney = res.data.tmoney
                    this.$router.push({'path':'/orderSuccess',query:{'order_no':order_no,'tmoney':tmoney}})
                }
                
            })
        }
    },
    mounted() {
        this.getPlaceOrder()
    },
    
}
</script>
<style lang="">
    
</style>